﻿@model AddOrganizationViewModel
@{
    ViewBag.Title = "Add Organization";
    ViewBag.MdPageColumns = GalleryConstants.ColumnsFormMd;

    var gravatarId = "gravatar-image";
    var emailBoxGroupId = "email-box-group";

    var organizationNameTextGroupId = "organization-name";
    var organizationNameTextId = "organization-name-text";

    var errorMessage = TempData["AddOrganizationErrorMessage"];
}

<section role="main" class="container main-container page-add-organization">
    <div class="row">
        <div class="@ViewHelpers.GetColumnClasses(ViewBag)">
            @ViewHelpers.OrganizationsBreadcrumb(Url, CurrentUser, true, @<text>Add</text>)
            <p>
                Organizations allow you to manage and publish packages as a team or a group. <a href="https://go.microsoft.com/fwlink/?linkid=870439" aria-label="Learn more about organizations on NuGet.Org">Learn more.</a>
            </p>
            @if (errorMessage != null)
            {
                @ViewHelpers.AlertDanger(@<text>@errorMessage</text>)
            }
            <div>
                <aside class="col-sm-3 col-sm-push-9">
                    <b>Logo</b>
                    <img class="package-icon img-responsive owner-image package-default-icon"
                         height="332"
                         id="gravatar-image"
                         width="332"
                         alt="gravatar"
                         title="Organization logo"
                         aria-label="Organization logo" />
                    <p class="ms-font-s">
                        We use the organization's name and its verified email address to get its publicly visible Gravatar profile picture
                        (or a default image if it does not have a Gravatar profile picture). Please go to gravatar.com to change the profile picture for your organization.
                    </p>
                </aside>

                <div class="col-sm-6 col-sm-pull-3">
                    @using (Html.BeginForm("Add", "Organizations", FormMethod.Post))
                    {
                        @Html.AntiForgeryToken()

                        <div class="form-group @Html.HasErrorFor(m => m.OrganizationName)" id="@organizationNameTextGroupId">
                            <span class="required">@Html.ShowLabelFor(m => m.OrganizationName)</span>
                            @Html.ShowTextBoxFor(m => m.OrganizationName, customClass: "input-brand")
                            <span class="ms-font-s">This will be your organization account on <i id="@organizationNameTextId">@Url.User("{username}", relativeUrl: false)</i>.</span>
                            @Html.ShowValidationMessagesFor(m => m.OrganizationName)
                        </div>

                        <div class="form-group @Html.HasErrorFor(m => m.OrganizationEmailAddress)" id="@emailBoxGroupId">
                            <span class="required">@Html.ShowLabelFor(m => m.OrganizationEmailAddress)</span>
                            @Html.ShowTextBoxFor(m => m.OrganizationEmailAddress, customClass: "input-brand")
                            <span class="ms-font-s">Users can contact your organization at this email address.</span>
                            @Html.ShowValidationMessagesFor(m => m.OrganizationEmailAddress)
                        </div>

                        <div class="form-group row">
                            <div class="col-xs-6">
                                <input type="submit" class="btn btn-brand form-control" value="Add" />
                            </div>
                            <div class="col-xs-6">
                                <button type="button" onclick="window.location.href = '@Url.ManageMyOrganizations()'" class="btn btn-brand-secondary form-control">Cancel</button>
                            </div>
                        </div>
                    }
                </div>
            </div>
        </div>
    </div>
</section>

@section BottomScripts {
    <script type="text/javascript">
        var gravatarId = "@gravatarId";
        var emailBoxGroupId = "@emailBoxGroupId";
        var organizationNameTextGroupId = "@organizationNameTextGroupId";
        var organizationNameTextId = "@organizationNameTextId";
        var defaultImage = "@Html.Raw(@Url.Absolute("~/Content/gallery/img/default-package-icon-256x256.png"))";
        var emailValidationRegex = new RegExp("@Html.Raw(@GalleryConstants.EmailValidationRegex)");
    </script>
    @Scripts.Render("~/Scripts/gallery/page-add-organization.min.js")
}